<script setup>
import { useTheme } from "vuetify";
import ScrollToTop from "@core/components/ScrollToTop.vue";
import initCore from "@core/initCore";
import { initConfigStore, useConfigStore } from "@core/stores/config";
import { hexToRgb } from "@core/utils/colorConverter";
// import "vuetify-sonner/style.css";
import { useStore } from "@/stores/index";
import {Toaster} from 'vue-sonner'

const store = useStore();


const { global } = useTheme();

// ℹ️ Sync current theme with initial loader theme
initCore();
initConfigStore();

const configStore = useConfigStore();
</script>

<template>
  <VLocaleProvider :rtl="configStore.isAppRTL">
    <!-- ℹ️ This is required to set the background color of active nav link based on currently active global theme's primary -->
    <VApp :style="`--v-global-theme-primary: ${hexToRgb(global.current.value.colors.primary)}`">
      <Toaster />
      <!-- <AppSonner /> -->
      <!-- <VSonner position='top-center' /> -->
      <v-overlay :model-value="store.loading" persistent class="align-center justify-center">
        <v-progress-circular color="primary" size="64" indeterminate></v-progress-circular>
      </v-overlay>
      <RouterView />
      <ScrollToTop />
    </VApp>
  </VLocaleProvider>
</template>

